<template>
  <button @click="countDownFn">开始倒计时</button>
  <button @click="pause">停止定时器</button>
</template>

<script>
import { useIntervalFn } from '@vueuse/core'
export default {
  setup () {
    // let timerId = null
    // const countDownFn = () => {
    //   if (timerId) clearInterval(timerId)
    //   timerId = setInterval(() => {
    //     console.log('倒计时开始了')
    //   }, 100)
    // }

    // const pauseFn = () => {
    //   clearInterval(timerId)
    // }

    // setInterval(回调函数, 时间间隔)
    // useIntervalFn(回调函数, 时间间隔, 是否立即执行)
    //    resume  启动定时器
    //    pause   停止定时器

    const { resume, pause } = useIntervalFn(() => {
      console.log('倒计时开始了')
    }, 1000, { immediate: false })

    const countDownFn = () => {
      resume()
    }

    return { countDownFn, pause }
  }
}
</script>

<style>

</style>
